שימוש ב-services

יצירת service

ng g s services/employee

השירות הזה אחראי על אספקת הנתונים.

employee.service.ts

getEmployees(){
  return [
      {"id": 1, "name": "Jack", "age": 30},
      ...
  ]
}

ב-class שאנחנו רוצים להשתמש בו נכין משתנה שיקלוט את הנתונים. במקרה הזה, זאת הקומפוננטה של רשימת העובדים.

employee-list.component.ts

public employees = [];

נוכל ליצור גם בקומפוננטה אחרת את המשתנה שיקלוט את רשימת העובדים.

employee-detail.component.ts

public employees = [];

אנחנו צריכים לרשום את השירות אחרת הוא ישמש כפונקציה רגילה. הכי טוב לעשות את זה ב-app.module כדי שכולם יוכלו להשתמש בשירות.

app.module.ts

providers: [EmployeeService],

עכשיו נרשום את השירות ב-constructor של ה-class שמשתמש בו. יש לנו משתנה מקומי בשם employeeService שיש לו גישה למשתנים והפונקציות של ה-service.

employee-list.component.ts

public employees = [];

constructor(private employeeService: EmployeeService){}

ngOnInit(){
    this.employees = this.employeeService.getEmployees();
}

אחרי שמגדירים את ה-service ב-app.module אפשר לשנות את ב-class שמספק את השירות.

app.module.ts

providers: [
    { provide: MovieService, useClass: MovieService }
    // We can change the service provider.
    // { provide: MovieService, useClass: MovieServiceMock }
],

Singleton Service

כשה-service מוגדר ב-app.module הוא מוגדר כ-singleton. כל האפליקציה משתמשת באותו השירות. אם נגדיר את ה-service בתוך component, לכל component יהיה מופע של service בפני עצמו.